<!DOCTYPE html>

<html>
<head>
	<title>AIL - Add Cookies</title>
	<link rel="icon" href="{{ url_for('static', filename='image/ail-icon.png')}}">
	<!-- Core CSS -->
	<link href="{{ url_for('static', filename='css/bootstrap4.min.css') }}" rel="stylesheet">
	<link href="{{ url_for('static', filename='css/font-awesome.min.css') }}" rel="stylesheet">
	<link href="{{ url_for('static', filename='css/daterangepicker.min.css') }}" rel="stylesheet">

	<!-- JS -->
	<script src="{{ url_for('static', filename='js/jquery.js')}}"></script>
	<script src="{{ url_for('static', filename='js/popper.min.js')}}"></script>
	<script src="{{ url_for('static', filename='js/bootstrap4.min.js')}}"></script>

</head>

<body>

	{% include 'nav_bar.html' %}

	<div class="container-fluid">
		<div class="row">

			{% include 'crawler/menu_sidebar.html' %}

			<div class="col-12 col-lg-10" id="core_content">

				<div class="card mb-3 mt-1">
                    <div class="card-header text-white bg-dark">
						<div class="row">
							<div class="col-8">
		                        <h5 class="card-title"><i class="fas fa-cookie-bite"></i> Edit Cookiejar</h5>
							</div>
							<div class="col-4">
                                <a class="btn btn-danger float-right" href="{{ url_for('crawler_splash.crawler_cookiejar_delete') }}?uuid={{cookiejar_metadata['uuid']}}">
		                            <i class="fas fa-trash-alt"></i>
		                        </a>
							</div>
						</div>
                    </div>
                    <div class="card-body">
						{% with all_cookiejar=[cookiejar_metadata], table_id='table_cookiejar'%}
	                        {% include 'crawler/crawler_splash/table_cookiejar.html' %}
	                    {% endwith %}

						<button class="btn btn-info" onclick="show_edit_description();">
							Edit Description <i class="fas fa-pencil-alt"></i>
						</button>

						<span class="mt-1" id="description-edit-block">
							<div class="input-group">
								<input class="form-control" type="text" id="input-description" value="{{cookiejar_metadata['description']}}">
								<div class="input-group-append">
									<button class="btn btn-info" onclick="edit_description();">
										<i class="fas fa-pencil-alt"></i> Edit
									</button>
								</div>
							</div>
						</span>

					</div>
				</div>

                <div class="card mb-3 mt-1">
                    <div class="card-header text-white bg-dark">
						<div class="row">
							<div class="col-8">
		                        <h5 class="card-title"><i class="fas fa-cookie"></i> Cookies</h5>
							</div>
						</div>
                    </div>
                    <div class="card-body">
                        <a href="{{ url_for('crawler_splash.crawler_cookiejar_cookie_add')}}?uuid={{cookiejar_metadata['uuid']}}">
							<button class="btn btn-primary">
								Add Cookies <i class="fas fa-cookie"></i>
							</button>
                        </a>

                        {% with l_elem=cookiejar_metadata['cookies'] %}
                            {% include 'crawler/crawler_splash/cookies_card_block.html' %}
                        {% endwith %}
                    </div>
                </div>

                <div class="card mb-3 mt-1">
                    <div class="card-header text-white bg-dark">
						<div class="row">
							<div class="col-8">
		                        <h5 class="card-title"><i class="fas fa-floppy-disk"></i> Local Storage</h5>
							</div>
                            <div class="col-4">
                                <a class="btn btn-danger float-right" href="{{ url_for('crawler_splash.crawler_cookiejar_local_storage_delete') }}?uuid={{cookiejar_metadata['uuid']}}">
		                            <i class="fas fa-trash-alt"></i>
		                        </a>
							</div>
						</div>
                    </div>
                    <div class="card-body">
                        <pre>{{ cookiejar_metadata['local_storage'] }}</pre>
                    </div>
                </div>

			</div>
		</div>
	</div>

</body>

<script>
var chart = {};
$(document).ready(function(){
	$('#description-edit-block').hide();
	$("#page-crawler").addClass("active");
	$("#nav_title_cookiejar").removeClass("text-muted");
});


function toggle_sidebar(){
	if($('#nav_menu').is(':visible')){
		$('#nav_menu').hide();
		$('#side_menu').removeClass('border-right')
		$('#side_menu').removeClass('col-lg-2')
		$('#core_content').removeClass('col-lg-10')
	}else{
		$('#nav_menu').show();
		$('#side_menu').addClass('border-right')
		$('#side_menu').addClass('col-lg-2')
		$('#core_content').addClass('col-lg-10')
	}
}

function show_edit_description(){
	$('#description-edit-block').show();
}

function edit_description(){
	var new_description = $('#input-description').val()
	var data_to_send = { uuid: "{{cookiejar_metadata['uuid']}}", "description": new_description}

	$.get("{{ url_for('crawler_splash.crawler_cookiejar_edit') }}", data_to_send, function(data, status){
			if(status === "success") {
				$('#description-text').text(new_description)
				$('#description-edit-block').hide();
			}
	});
}

</script>
